Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Long instance names use ellipsis when overflowed in menu item #26955

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Long instance names use ellipsis when overflowed in menu item #26955

wants to merge 1 commit into from

Conversation

Aryakoste
Copy link
Contributor

Summary

When text in menu item overflows it will show ellipsis instead of overflowing outsite the container.

Ticket Link

Fixes #26863
Jira https://mattermost.atlassian.net/browse/MM-57900

Screenshots

Release Note

NONE

@mm-cloud-bot mm-cloud-bot added the release-note-none Denotes a PR that doesn't merit a release note. label May 5, 2024
@mattermost-build
Copy link
Contributor

Hello @Aryakoste,

Thanks for your pull request! A Core Committer will review your pull request soon. For code contributions, you can learn more about the review process here.

@hanzei hanzei requested a review from asaadmahmood May 6, 2024 07:29
@hanzei hanzei added 2: Dev Review Requires review by a developer 1. UX Review Requires review by a UX Designer labels May 6, 2024
asaadmahmood
asaadmahmood approved these changes May 6, 2024
View reviewed changes
Copy link
Contributor

@asaadmahmood asaadmahmood left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@mattermost-build
Copy link
Contributor

This PR has been automatically labelled "stale" because it hasn't had recent activity.
A core team member will check in on the status of the PR to help with questions.
Thank you for your contribution!

@matthewbirtch matthewbirtch added the 3: QA Review Requires review by a QA tester. May occur at the same time as Dev Review label Jun 11, 2024
@unified-ci-app
Copy link
Contributor

Not triggering E2E tests: this PR has 1 commit status(es) or check-runs that are not passing. Ensure all statuses aside from the E2E testing ones are green, before triggering E2E tests.

larkox
larkox reviewed Jun 11, 2024
View reviewed changes
webapp/channels/src/components/widgets/menu/menu_items/menu_item.tsx
@@ -34,7 +34,7 @@ export default function menuItem(Component: React.ComponentType<any>) {
textProp = (
<>
<span className='icon'>{icon}</span>
{text}
<div className='text'>{text}</div>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This only wraps the text if there is an icon. If there is no icon, it would still fail to show the ellipsis, since the style is only applied to the div.

Is that intended?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@larkox larkox larkox left review comments

@asaadmahmood asaadmahmood asaadmahmood approved these changes

At least 2 approving reviews are required to merge this pull request.

Assignees
No one assigned
Labels
1. UX Review Requires review by a UX Designer 2: Dev Review Requires review by a developer 3: QA Review Requires review by a QA tester. May occur at the same time as Dev Review Contributor Lifecycle/1:stale release-note-none Denotes a PR that doesn't merit a release note.
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

With long instance names, the About message gets cut
7 participants
@Aryakoste @mattermost-build @larkox @asaadmahmood @matthewbirtch @hanzei @mm-cloud-bot